<template>
  <div class="registerbox">
    <div class="maincss">
      <el-row>
        <el-card>
          <el-button class="fr" @click="toBack()">取消</el-button>
          <el-button class="fr" type="primary" @click="onSubmit"
            >提交</el-button
          >
          <h3>新建质控文件</h3>
        </el-card>

        <el-card>
          <el-form ref="form" :model="form" class="form">
            <p>基础信息</p>
            <el-divider />
            <table class="tab-box">
              <tr>
                <td>质控文件名称</td>
                <td>
                  <el-input v-model="form.fileName"></el-input>
                </td>
                <td>当前版本号</td>
                <td>
                  <el-input />
                </td>
              </tr>
              <tr>
                <td>所属项目</td>
                <td>
                  <el-input v-model="form.projectId" />
                </td>
                <td>质控文件类型</td>
                <td>
                  <el-input v-model="form.fileType" />
                </td>
              </tr>
              <tr>
                <td>创建人</td>
                <td>
                  <el-input v-model="form.creater" />
                </td>
                <td>发布日期</td>
                <td>
                  <el-input v-model="form.publishTime" />
                </td>
              </tr>
              <tr>
                <td class="widthTd">内容描述</td>
                <td colspan="3">
                  <el-input type="textarea" v-model="form.description" />
                </td>
              </tr>
              <tr>
                <td class="widthTd">附件上传</td>
                <td>
                  <el-upload
                    class="avatar-uploader"
                    action="https://jsonplaceholder.typicode.com/posts/"
                    :show-file-list="false"
                    :on-success="handleAvatarSuccess"
                    :before-upload="beforeAvatarUpload"
                  >
                    <img v-if="imageUrl" :src="imageUrl" class="avatar" />
                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                  </el-upload>
                </td>
              </tr>
            </table>
          </el-form>
        </el-card>
      </el-row>
    </div>
  </div>
</template>

<script>
import { addQualityFiles } from "@/api/business/qualityFiles";

export default {
  name: "addQuality",
  data() {
    return {
      imageUrl: "",
      form: {
        fileName: "",
        projectId: 1,
        fileType: 1,
        creater: "",
        publishTime: "",
        description: "",
        status: 1,
        description: "",
        publishTime: "",
        pageSize: 10,
        pageNum: 1,
        // orderByColumn: "",
        // isAsc: "asc",
      },
    };
  },
  methods: {
    onSubmit() {
      addQualityFiles(this.form).then((response) => {
        this.msgSuccess("新增成功");
        this.$router.push({ path: "/project/qualityFile" });
      });
    },
    handleAvatarSuccess() {},
    beforeAvatarUpload() {},
    toBack() {
      this.$router.push({ path: "/project/qualityFile" });
    },
  },
};
</script>

<style scoped>
.tab-box tr {
  height: 50px;
}

.tab-box tr td {
  height: 50px;
}
</style>
